<template>
  <div>
    <n-card :bordered="false" title="">
      <!-- 快速搜索 -->
      <div class="">
        <n-button type="info">
          新增
        </n-button>
        <!-- <n-button type="info">
		      离职人员
		    </n-button> -->
      </div>

      <!-- 表格 -->
     <n-data-table :columns="columns" :pagination="pagination" :data="contract_list" striped style="margin-top: 2rem;" />







    </n-card>
  </div>
</template>

<script>
  import qs from 'qs';
  import axios from 'axios';
  import {
    onMounted,
    reactive,
    toRefs,
    ref,
  } from 'vue';
  import {
    h,
    defineComponent
  } from "vue";
  import {
    NTag,
    NButton,
    useMessage
  } from "naive-ui";
  export default {
    setup() {
 function fun() {
        axios({
            method: "post", //请求方式
            url: "/api/contracttype/index", //url
            data: qs.stringify({
              // 参数
            
            }),
          }).then(response => {
            console.log(response.data, '合同分类——列表');
            data_.contract_list = response.data.data;
          })
          .catch(function(error) { // 请求失败处理
            console.log(error);
          });
      };
        const data_ = reactive({
          contract_list:[],
          user_status:2,
        });
        const paginationReactive = reactive({
          page: 1,
          pageSize: 5,
          showSizePicker: true,
          pageSizes: [3, 5, 7, 10],
          onChange: (page) => {
            paginationReactive.page = page;
          },
          onUpdatePageSize: (pageSize) => {
            paginationReactive.pageSize = pageSize;
            paginationReactive.page = 1;
          }
        });
        const createColumns = ({
          sendMail_1,
          sendMail_2,
          sendMail_3
        }) => {
          return [{
              type: 'selection'
            },
            {
              title: '分类名称',
              key: 'name',
            },
        {
          title: '创建时间',
          key: 'create_time ',
        },
           
            {
        
              title: '更新时间',
              key: ' update_time'
            },
        //     {
        //       title: "操作",
        //       key: "actions",
        //       // align:"right",
        //       titleColSpan: data_.user_status == 4 ? 1 : 3,
        //       width: 1,
        //       render(row) {
        //         return h(NButton, {
        //           size: "small",
        //           color: 'green',
        //           // align:"center",
        //           onClick: () => sendMail_1(row)
        //         }, {
        //           default: () => "详情"
        //         });
        
        //       },
        
        //     },
            // {
            //   title: "",
            //   width: 1,
            //   key: "status",
            //   render(row) {
            //     return h(NButton, {
            //       size: "small",
            //       color: 'blue',
            //       // disabled: row.status == '在职' ? false : true,
            //       // secondary:true,
            //       // disabled:data_.user_status==4&&row.status==在职?true:false,
            //       // text: data_.user_status == 4 ? true : false,
            //       onClick: () => sendMail_2(row)
            //     }, {
            //       default: () => {
            //         if (data_.user_status != 4) {
            //           return '编辑'
            //         } else if (data_.user_status == 4) {
            //           return ''
            //         }
            //       }
            //     });
            //   },
            // },
            // {
            //   title: "",
            //   width: 1,
            //   key: "actions",
            //   render(row) {
            //     return h(NButton, {
            //       size: "small",
            //       color: 'red',
            //       // secondary:true,
            //       disabled: data_.user_status == 4 ? true : false,
            //       text: data_.user_status == 4 ? true : false,
            //       onClick: () => sendMail_3(row)
            //     }, {
            //       default: () => {
            //         if (data_.user_status != 4) {
            //           return '删除'
            //         } else if (data_.user_status == 4) {
            //           return ''
            //         }
            //       }
            //     });
            //   },
            // }
          ];
        };
 onMounted(() => {
        fun();
      });
      return {
 ...toRefs(data_),
 pagination: paginationReactive,
 columns: createColumns({
   sendMail_1(rowData) {
     console.log(rowData.id, '详情');
     user_detail(rowData.id);
   },
   sendMail_2(rowData) {
     console.log(rowData.status, '编辑')
     user_redact(rowData.id);
   },
   sendMail_3(rowData) {
     console.log(rowData.id, '删除');
 
   }
 }),
      }
    }
  }
</script>

<style>
</style>
